<template>
	<view v-else class="bg">
	    <view class="red-count">
	    	<text>红包个数</text>
			<!-- <input type="text" placeholder="填写个数" :value="count" @input="@inputCount"> -->
			<input  maxlength="2" v-model="count" type="number" placeholder="输入个数"/>
	    </view>
		<view class="amount">
			<text>总金额</text>
			<input  maxlength="3"  v-model="amount" type="digit" placeholder="输入金额"/>
		</view>
		<view class="money">
			￥{{amount}}
		</view>
		<view class="send_packet" @click="sendEvent">
			塞钱进红包
		</view>
		<view class="personage" @click="nav_to('/pages/user/balance')">
			领取的红包将进入红包收入 可提现 >
		</view>
	</view>
</template>

<script>

	export default {
		tabTop: 0,
		components: {

		},
		data() {
			return {
				 count:null, //个数
				 amount:null,//金额
				 convInfo: {}, //对话的人的相关信息
				 list:[],
				 lastTime:0,
			}
		},
		computed:{
			// 时间格式
			format_time() {
			  return time => {
			    return this.$util.dateUtils.format_chat(Math.floor(time / 1000));
			  };
			}
		},
		methods: {
			scrollBottom() {
			  if (this.list.length < 2) return
			  let n = this.list.length
			  this.scrollId = 'scroll' + this.list[n - 2].messageID
			  setTimeout(() => {
			    this.scrollId = 'scroll' + this.list[n - 1].messageID
			  }, 10)
			},
		async sendEvent(){
				const {
					id,
					type
				}=this.convInfo
				if(!this.count||this.count<=0||isNaN(this.count)){
					uni.showToast({
						title: '请输入有效个数',
						duration: 2000,
						icon:'error'
					});
					return
				}
				if(!this.amount||this.amount<=0||isNaN(this.amount)){
					uni.showToast({
						title: '请输入有效金额',
						duration: 2000,
						icon:'error'
					});
					return
				}
				const user=uni.getStorageSync('user')
				const textMsg={
					red_id:Math.random().toString().substr(2, 10),
					amount:parseInt(this.amount),
					count:this.count,
					userID:user.ID,
					userName:user.Name
				}
				
				  // 自定义对话内容(自定义消息,JSON(消息),id,判断条件)
				await this.$im.sendMessage2(200,JSON.stringify(textMsg),id,2, 14).then(res => {
					console.log('.......红包',res);
				    if (!this.lastTime || res.message.timestamp - this.lastTime > time) {
				      this.list.push({
				        messageID: Math.random().toString().substr(2, 10),
				        subType: 1,
				        time: this.format_time(res.message.timestamp),
				      })
				      this.lastTime = res.message.timestamp
				    }
				    this.list.push(res.message);
				    // this.scrollBottom();
					// console.log( this.list);
				  })
				  // return;
				// }
				uni.showToast({
					title: '发送成功',
					duration: 2000,
					icon:'success'
				});
				this.$pv.load()
				this.nav_to(`/pages/chat/group_chat?id=${id}&type=2`)
			}
			
		},
		
		async onLoad(e) {
			// 聊天对象信息
			this.convInfo = e;
			console.log(this.convInfo);
		},
		
		onShow() {
			
		}
	}
</script>

<style lang="scss">
	.bg{
		box-sizing: border-box;
		padding: 0 40rpx;
		padding-top: 40rpx;
	}
	.red-count {
		width: 100%;
		height: 100rpx;
		border-radius: 20rpx;
		box-sizing: border-box;
		display: flex;
		padding: 20rpx;
		background-color: #fff;
		justify-content: space-between;
		align-items: center;
		text{
			color: #000;
		}
		input{
			width: 200rpx;
			height: 60rpx;
		}
	}
	.amount {
		width: 100%;
		height: 100rpx;
		border-radius: 20rpx;
		box-sizing: border-box;
		display: flex;
		padding: 20rpx;
		background-color: #fff;
		justify-content: space-between;
		align-items: center;
		margin-top: 60rpx;
		text{
			color: #000;
		}
		input{
			width: 200rpx;
			height: 60rpx;
		}
	}
	.money{
		width: 100%;
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
		font-size: 30px;
		font-weight: 900;
		margin: 120rpx 0 60rpx 0 ;
	}
	.send_packet{
		width: 300rpx;
		height: 100rpx;
		color: #fff;
		border-radius: 10rpx;
		font-size: 14px;
		line-height: 100rpx;
		text-align: center;
		background-color: #fb5353;
		margin: 0 auto;
	}
	.personage{
		box-sizing: border-box;
		width: 100%;
		height: 40rpx;
		font-size: 12px;
		color: #c49a4e;
		text-align: center;
		line-height: 40rpx;
		position: fixed;
		left: -8rpx;
		bottom: 30rpx;
	}
</style>